codeblitz-root {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}

.landing {
  position: absolute;
  z-index: 10;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #4D4D4D;
  background-color: #FFF;
}

:global(.codeblitz-dark) .landing {
  color: #D7DBDE;
  background-color: #202224;
}

:global(.codeblitz-dark) {
  background-color: #202224;
}

.loading {
  animation: loadingCircle 1s infinite linear;
  margin-right: 8px;
  vertical-align: -2px;
}

@keyframes loadingCircle {
  100% {
    transform: rotate(360deg);
  }
}

.tip {
  .error {
    color: #FF4D4F;
  }
}

.hide-editor-tab {
  [class^='kt_editor_group'] {
    > [class^='editorGroupHeader'] {
      display: none !important;
    }
    > [class^='kt_editor_body'] {
      height: 100% !important;
    }
  }
}

.line-glyph-margin {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='64 64 896 896' focusable='false' data-icon='link' width='1em' height='1em' fill='currentColor' aria-hidden='true'%3E%3Cpath d='M574 665.4a8.03 8.03 0 00-11.3 0L446.5 781.6c-53.8 53.8-144.6 59.5-204 0-59.5-59.5-53.8-150.2 0-204l116.2-116.2c3.1-3.1 3.1-8.2 0-11.3l-39.8-39.8a8.03 8.03 0 00-11.3 0L191.4 526.5c-84.6 84.6-84.6 221.5 0 306s221.5 84.6 306 0l116.2-116.2c3.1-3.1 3.1-8.2 0-11.3L574 665.4zm258.6-474c-84.6-84.6-221.5-84.6-306 0L410.3 307.6a8.03 8.03 0 000 11.3l39.7 39.7c3.1 3.1 8.2 3.1 11.3 0l116.2-116.2c53.8-53.8 144.6-59.5 204 0 59.5 59.5 53.8 150.2 0 204L665.3 562.6a8.03 8.03 0 000 11.3l39.8 39.8c3.1 3.1 8.2 3.1 11.3 0l116.2-116.2c84.5-84.6 84.5-221.5 0-306.1zM610.1 372.3a8.03 8.03 0 00-11.3 0L372.3 598.7a8.03 8.03 0 000 11.3l39.6 39.6c3.1 3.1 8.2 3.1 11.3 0l226.4-226.4c3.1-3.1 3.1-8.2 0-11.3l-39.5-39.6z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 12px 12px;
  background-position: center center;
}

.line-glyph-margin ~ :global(.line-numbers) {
  text-decoration: underline;
}

.line-content {
  background-color: #F90;
  opacity: 0.2;
}

.line-anchor {
  visibility: hidden;
}

// override opensumi style
:global {
  // fix image-preview style
  [class^='kt_image_preview'] img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    width: auto !important;
  }
  .codeblitz-root {
    .monaco-editor .margin-view-overlays .folding.collapsed,
    .monaco-editor .margin-view-overlays .folding.alwaysShowFoldIcons,
    .monaco-editor .margin-view-overlays:hover .folding {
      display: initial;
    }
  }
}

:global(.codeblitz-editor) .landing {
  color: inherit;
  background-color: inherit;
}
